import { useState ,useEffect } from 'react'
import { HashRouter } from "react-router-dom";
import { AliveScope } from 'react-activation';
import { Provider } from 'react-redux';
import { Toast } from 'antd-mobile';
import 'amfe-flexible'; // 导入适配
import '@/locales/index'; // 导入国际化
import '@/styles/common.less'; // 导入公共样式
import '@/styles/theme-variables.less'; // 导入主题变量
import "@/assets/font/font.css";
import { initFn } from '@/hooks/useCommon'
import { applyThemeWithTransition } from '@/utils/themeHelper'
// import vConsole from '@/utils/console'
// import { useMobileScreen } from '@/utils/device'
// const isMobile = useMobileScreen()
const $globalReady = () => {
  // 处理url
  // vConsole.show()
  const handleLoadUrl = () => {
    const url = window.location.href;
    const match = url.match(/#([^?]+)/);
    const path = match ? match[1] : url.substring(url.indexOf('#') + 2);
    return path;
  };
  useEffect(() => {
    const url = handleLoadUrl()
    
    // 检查是否是预览模式（来自后台管理的iframe）
    const urlParams = new URLSearchParams(window.location.search);
    const isPreviewMode = urlParams.get('preview') === '1';
    
    if (isPreviewMode) {
      console.log('[Theme Preview] 📱 进入预览模式，监听后台主题配置...');
    }
    
    // ========== 初始化主题系统 ==========
    console.log('[App] 初始化主题系统...');
    console.log('[App] 环境:', import.meta.env.DEV ? '开发' : '生产');
    
    // 预览模式下不显示 Loading，后台已经有提示了
    const loadingToast = isPreviewMode ? null : Toast.show({
      icon: 'loading',
      content: '正在加载主题，请稍候...',
      duration: 0, // 持续显示直到手动关闭
      maskClickable: false,
    });
    
    // 开发环境下始终强制刷新主题配置
    const forceRefresh = import.meta.env.DEV;
    console.log('[App] 强制刷新主题:', forceRefresh);
    
    // 异步加载主题并处理结果
    $globalRedux.dispatch($globalReduxAction('theme').loadThemeConfig(forceRefresh))
      .then(() => {
        console.log('[App] ✅ 主题系统初始化完成');
        
        // 验证主题是否正确应用
        const bg = getComputedStyle(document.documentElement).getPropertyValue('--theme-bg-primary').trim();
        console.log('[App] 当前主背景色:', bg);
        
        // 关闭加载提示
        if (loadingToast) {
          loadingToast.close();
        }
      })
      .catch((error) => {
        console.error('[App] ❌ 主题系统初始化失败:', error);
        
        // 关闭加载提示并显示错误
        if (loadingToast) {
          loadingToast.close();
          Toast.show({
            icon: 'fail',
            content: '主题加载失败，已使用默认主题',
            duration: 2000,
          });
        }
      });
    
    // ========== 监听后台管理页面的主题预览消息 ==========
    // 只在预览模式下添加监听器，避免影响正常使用
    if (isPreviewMode) {
      const handleThemePreviewMessage = (event) => {
        // 安全检查：只处理我们期望的消息类型
        if (event.data && event.data.type === 'THEME_PREVIEW_UPDATE') {
          console.log('[Theme Preview] 📨 收到后台主题配置:', event.data.theme);
          
          // 立即应用新的主题配置
          try {
            applyThemeWithTransition(event.data.theme);
            console.log('[Theme Preview] ✅ 主题预览已更新');
            
            // 发送确认消息回后台（可选）
            if (event.source) {
              event.source.postMessage({
                type: 'THEME_PREVIEW_APPLIED',
                success: true
              }, event.origin);
            }
          } catch (error) {
            console.error('[Theme Preview] ❌ 主题应用失败:', error);
            
            // 发送错误消息回后台（可选）
            if (event.source) {
              event.source.postMessage({
                type: 'THEME_PREVIEW_APPLIED',
                success: false,
                error: error.message
              }, event.origin);
            }
          }
        }
      };
      
      // 添加消息监听器
      window.addEventListener('message', handleThemePreviewMessage);
      console.log('[Theme Preview] ✅ 已注册 postMessage 监听器');
      
      // 通知后台前端已准备好接收消息
      if (window.parent !== window) {
        console.log('[Theme Preview] 📡 通知后台：前端已就绪');
        window.parent.postMessage({
          type: 'THEME_PREVIEW_READY'
        }, '*');
      }
      
      // 清理函数：组件卸载时移除监听器
      return () => {
        window.removeEventListener('message', handleThemePreviewMessage);
        console.log('[Theme Preview] 🧹 已移除 postMessage 监听器');
      };
    }
    
    // console.log(isMobile, 'isMobile')
    // if (isMobile) {
    //   document.body.style.width = '375px';
    //   document.body.style.height = '667px';
    // }
    if (!['/', '/login', "/register"].includes(url)) {
      // initFn()
      if (localStorage.getItem('access_token')) {
        if (typeof window?.firstLoadInit === 'function') {
          window.firstLoadInit()
        }
      } else {
        window.location.href = '/#/login';
      }
    }
  }, [])
  return (
    <Provider store={$globalRedux}>
      <HashRouter>
        <AliveScope>
          <$globalGuard>
            <$globalRouter />
          </$globalGuard>
        </AliveScope>
      </HashRouter>
    </Provider>
  )
};

export { $globalReady };
